$(function () {
  // 1. 获取用户信息
  initGetUserInfo()
  // 4. 重置表单的操作
  // 给form表单添加提交事件
  $('.layui-form-user').on('submit', function (e) {
    // 阻止默认行为
    e.preventDefault();
    //获取表单区域所有值
    var data1 = form.val("formUser");
    // console.log(data1)
    // 发送ajax请求将最新的表单数据交给后台
    $.ajax({
      url: '/my/userinfo',
      method: 'POST',
      data: data1,
      success: function (data) {
        // console.log(data, 99998888)
        layer.msg(data.message)
        // 如果修改用户信息成功 我们应该调用index.html上获取用户信息的方法
        // 1. 让父html的getUserInfo调用(因为调用这个函数就可以重新通过ajax获取用户头像和用户昵称然后重新渲染)
        window.parent.getUserInfo()
        // console.log(window.parent, 123456)
      }
    })
  })
  // 重置按钮绑定事件
  $('#reset-btn').on('click', function (e) {
    // 阻止默认行为
    e.preventDefault()
    // 重新获取页面信息即可
    initGetUserInfo()
  })
})
// var form = layui.form, layer = layui.layer;
// ES6的对象解构
var {form, layer} = layui
// 定义获取用户信息的函数
function initGetUserInfo () {
  $.ajax({
    url: '/my/userinfo',
    method: 'get',
    // headers: {
    //   Authorization: localStorage.getItem('token')
    // },
    success: function (data) {
      // console.log(data, 66666)
      if (data.status !== 0) return layer.msg(data.message)
      // 2. 将用户信息放到对应的表单中
      // form.val("formUser", {
      //   id: 1,
      //   username: 'klxin',
      //   nickname: '凯伦',
      //   email: '5656456@qq.com'
      // })
      form.val("formUser", data.data)
      // 3. 将最新的用户新提交给后台 完成修改
    }
  })
}
// 定义表单校验规则
form.verify({
  nickname: function (value) { // value：表单的值
    // console.log(value)
    if (value.trim().length > 9 || value.trim().length < 2) {
      return '昵称必须在2到8位之间'
    }
  }
})
